const path = require('path');

var htmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
    entry: path.join(__dirname,'src/main.js'),
    output: {
        path: path.resolve(__dirname,'dist'),
        filename: 'bandle.js'
    },
    plugins:[ // 添加plugins节点配置插件
        new htmlWebpackPlugin({
            template:path.resolve(__dirname, 'src/index.html'),//模板路径
            filename:'index.html'//自动生成的HTML文件的名称
        })
    ],
    module: { // 用来配置第三方loader模块的
        rules: [ // 文件的匹配规则
            { test: /\.css$/, use: ['style-loader', 'css-loader'] },
            { test: /\.less$/, use: ['style-loader', 'css-loader','less-loader']},
            { test: /\.scss$/, use: ['style-loader', 'css-loader','sass-loader']},
            { test: /\.(png|jpg|gif)$/, use: 'url-loader?limit=7630&name=[hash:8]-[name].[ext]'},
            { test: /\.(ttf|eot|svg|woff|woff2)$/, use: 'url-loader' },
            { test: /\.js$/, use: 'babel-loader', exclude: /node_modules/},
            { test: /\.vue$/, use: 'vue-loader'}
        ]
    },
    resolve: {
        alias: {
            // 设置导入包的路径
            "vue$": 'vue/dist/vue.js'  
        }
    }
}